<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>审核配置-节点配置</title>

    <link rel="stylesheet" href="../../css/base.css">
    <link rel="stylesheet" href="../../../../plugins/layui/css/layui.css">
    <link rel="stylesheet" href="../../css/styleReset.css">

    <link rel="stylesheet" href="../../css/examin.css">
</head>
<body class="examine-node-body">
<div class="examineMana">
    <!-- 内容主体区域 -->
    <div class="content-box" style="display: flex;height: 100%;">
        <!--塞内容位置-->

        <!--内容部分 start-->
        <div class="content-right-part">
            <div class="search-bar">
                <div class="form-group search-radio-inline">
                    <label class="col-xs-2 control-label">是否审核</label>
                    <div class="col-xs-10 radiobox form-inline">
                        <label class="radiobox-item mr15" for="isShow1">
                            <i class="iconfont icon-exclusive_on"></i>
                            <input type="radio" class="chooseRadioBox" id="isShow1" name="isShow" value="1"
                                   title="是" checked>是
                        </label>
                        <label class="radiobox-item" for="isShow2">
                            <i class="iconfont icon-exclusive_off"></i>
                            <input type="radio" class="chooseRadioBox" id="isShow2" name="isShow" value="0"
                                   title="否">否
                        </label>
                    </div>
                    <div class="clearfix"></div>
                </div>
                <!--  <a href="javascript:void(0)">
                    <button type="button" class="btn btn-primary form-inline-search" id="examineBtn">查询</button>
                </a>-->
            </div>

            <div class="card card-content examineMana-content" id="examineManaContent">
                <div class="data-list">
                    <table class="layui-table" lay-even="" lay-skin="nob">
                        <thead>
                        <tr>
                            <th>节点</th>
                            <th>审核情况</th>
                            <th>审核人</th>
                            <th>操作</th>
                        </tr>
                        </thead>
                        <tbody id="examineManaList">
                        <tr data-id="11">
                            <td>节点一</td>
                            <td>初次审核</td>
                            <td>张东阳</td>
                            <td>
                                <a href="javascript:void(0)" class="edit-btn"><img src="../../image/detail.png" alt=""></a>
                                <a href="javascript:void(0)" class="delete-btn"><img src="../../image/delete.png" alt=""></a>
                            </td>
                        </tr>
                        <tr data-id="12">
                            <td>节点二</td>
                            <td>最终审核</td>
                            <td>张东阳</td>
                            <td>
                                <a href="javascript:void(0)" class="edit-btn"><img src="../../image/detail.png" alt=""></a>
                                <a href="javascript:void(0)" class="delete-btn"><img src="../../image/delete.png" alt=""></a>
                            </td>
                        </tr>
                        <tr data-id="13">
                            <td>节点三</td>
                            <td>最终审核</td>
                            <td>张东阳</td>
                            <td>
                                <a href="javascript:void(0)" class="edit-btn"><img src="../../image/detail.png" alt=""></a>
                                <a href="javascript:void(0)" class="delete-btn"><img src="../../image/delete.png" alt=""></a>
                            </td>
                        </tr>
                        <tr data-id="14">
                            <td>节点四</td>
                            <td>最终审核</td>
                            <td>张东阳</td>
                            <td>
                                <a href="javascript:void(0)" class="edit-btn"><img src="../../image/detail.png" alt=""></a>
                                <a href="javascript:void(0)" class="delete-btn"><img src="../../image/delete.png" alt=""></a>
                            </td>
                        </tr>
                        <tr data-id="15">
                            <td>节点五</td>
                            <td>最终审核</td>
                            <td>张东阳</td>
                            <td>
                                <a href="javascript:void(0)" class="edit-btn"><img src="../../image/edit.png" alt=""></a>
                                <a href="javascript:void(0)" class="delete-btn"><img src="../../image/delete.png" alt=""></a>
                            </td>
                        </tr>
                        <tr data-id="16">
                            <td>节点六</td>
                            <td>最终审核</td>
                            <td>张东阳</td>
                            <td>
                                <a href="javascript:void(0)" class="edit-btn"><img src="../../image/edit.png" alt=""></a>
                                <a href="javascript:void(0)" class="confirm-btn"><img src="../../image/confirm.png" alt=""></a>
                                <a href="javascript:void(0)" class="delete-btn"><img src="../../image/delete.png" alt=""></a>
                            </td>
                        </tr>
                        <tr data-id="17">
                            <td>节点七</td>
                            <td>最终审核</td>
                            <td>张东阳</td>
                            <td>
                                <a href="javascript:void(0)" class="edit-btn"><img src="../../image/edit.png" alt=""></a>
                                <a href="javascript:void(0)" class="confirm-btn"><img src="../../image/confirm.png" alt=""></a>
                                <a href="javascript:void(0)" class="delete-btn"><img src="../../image/delete.png" alt=""></a>
                            </td>
                        </tr>
                        <tr data-id="18">
                            <td>节点八</td>
                            <td>最终审核</td>
                            <td>张东阳</td>
                            <td>
                                <a href="javascript:void(0)" class="edit-btn"><img src="../../image/edit.png" alt=""></a>
                                <a href="javascript:void(0)" class="confirm-btn"><img src="../../image/confirm.png" alt=""></a>
                                <a href="javascript:void(0)" class="delete-btn"><img src="../../image/delete.png" alt=""></a>
                            </td>
                        </tr>
                        <tr data-id="19">
                            <td>节点九</td>
                            <td>最终审核</td>
                            <td>张东阳</td>
                            <td>
                                <a href="javascript:void(0)" class="edit-btn"><img src="../../image/edit.png" alt=""></a>
                                <a href="javascript:void(0)" class="confirm-btn"><img src="../../image/confirm.png" alt=""></a>
                                <a href="javascript:void(0)" class="delete-btn"><img src="../../image/delete.png" alt=""></a>
                            </td>
                        </tr>
                        <tr data-id="110">
                            <td>节点十</td>
                            <td>最终审核</td>
                            <td>张东阳</td>
                            <td>
                                <a href="javascript:void(0)" class="edit-btn"><img src="../../image/edit.png" alt=""></a>
                                <a href="javascript:void(0)" class="confirm-btn"><img src="../../image/confirm.png" alt=""></a>
                                <a href="javascript:void(0)" class="delete-btn"><img src="../../image/delete.png" alt=""></a>
                            </td>
                        </tr>
                        </tbody>
                    </table>

                    <table class="layui-table" lay-even="" lay-skin="nob">
                        <tbody>
                            <tr>
                                <td colspan="4" style="text-align: left;text-indent:40px">
                                    <button type="button" class="btn btn-link add-node-btn"> 增加节点> </button>
                                </td>
                        </tbody>
                    </table>

                    <!--分页功能 start-->
                    <div id="examineManaPage" class="page-box">

                    </div>
                    <!--分页功能 end-->
                </div>
            </div>
        </div>
        <!--内容部分 end-->
        <div class="clearfix"></div>
    </div>
</div>

<!--增加节点弹层模态框 start-->
<div class="modal fade" id="addNodeModal" tabindex="-1" role="dialog" aria-labelledby="addNodeModalLabel" align="center">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h3 class="modal-title" id="addNodeModalLabel">新增节点</h3>
            </div>
            <div class="modal-body">
                <div class="madal-body-content">
                    <form class="form-horizontal">
                        <div class="form-group">
                            <label for="knowHouseName" class="col-xs-2 control-label">知识库名称:</label>
                            <div class="col-xs-10">
                                <input type="text" class="form-control" id="knowHouseName" placeholder="">
                            </div>
                        </div>
                    </form>
                    <div class="madal-body-height">
                        <div class="left-node-tree pull-left">
                            <div class="title">XX集团中心：</div>
                            <div id="nodeTree"></div>
                        </div>
                        <div class="right-node-content pull-right">
                            <div class="search-result-content">
                                <div class="data-list">
                                    <table class="layui-table" lay-even="" lay-skin="nob">
                                        <thead>
                                        <tr>
                                            <th> </th>
                                            <th>工号</th>
                                            <th>姓名</th>
                                        </tr>
                                        </thead>
                                        <tbody id="nodeModalList">
                                        <tr data-id="11">
                                            <td><input type="radio" name="nodeName" value="11"></td>
                                            <td>D483924</td>
                                            <td>张东阳</td>
                                        </tr>
                                        <tr data-id="12">
                                            <td><input type="radio" name="nodeName" value="12"></td>
                                            <td>D483924</td>
                                            <td>张东阳</td>
                                        </tr>
                                        <tr data-id="13">
                                            <td><input type="radio" name="nodeName" value="13"></td>
                                            <td>D483924</td>
                                            <td>张东阳</td>
                                        </tr>
                                        <tr data-id="14">
                                            <td><input type="radio" name="nodeName" value="14"></td>
                                            <td>D483924</td>
                                            <td>张东阳</td>
                                        </tr>
                                        <tr data-id="15">
                                            <td><input type="radio" name="nodeName" value="15"></td>
                                            <td>D483924</td>
                                            <td>张东阳</td>
                                        </tr>
                                        <tr data-id="16">
                                            <td><input type="radio" name="nodeName" value="16"></td>
                                            <td>D483924</td>
                                            <td>张东阳</td>
                                        </tr>
                                        <tr data-id="17">
                                            <td><input type="radio" name="nodeName" value="17"></td>
                                            <td>D483924</td>
                                            <td>张东阳</td>
                                        </tr>
                                        <tr data-id="18">
                                            <td><input type="radio" name="nodeName" value="18"></td>
                                            <td>D483924</td>
                                            <td>张东阳</td>
                                        </tr>
                                        <tr data-id="19">
                                            <td><input type="radio" name="nodeName" value="19"></td>
                                            <td>D483924</td>
                                            <td>张东阳</td>
                                        </tr>
                                        <tr data-id="110">
                                            <td><input type="radio" name="nodeName" value="110"></td>
                                            <td>D483924</td>
                                            <td>张东阳</td>
                                        </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>

                </div>
                <div class="clearfix"></div>
            </div>
            <div class="modal-footer save-btn-content">
                <button type="button" class="btn btn-primary saveNodeModel">确 定</button>
                <button type="button" class="btn btn-default cancel-btn" data-dismiss="modal">取 消</button>
            </div>
        </div>
    </div>
</div>
<!--增加节点弹层模态框 end-->
<script src="../../../../plugins/jquery/jquery-1.12.4.js"></script>
<script src="../../../../plugins/bootstrap.js"></script>
<script src="../../../../plugins/layui/layui.js"></script>
<script src="../../../../plugins/My97DatePicker/WdatePicker.js"></script>
<script src="../../js/util.js"></script>
<script>
    layui.use(['tree','layer', 'laypage', 'element'], function () {
        var layer = layui.layer
            , element = layui.element
            , laypage = layui.laypage
            , $ = layui.jquery;

        // 查核列表分页
        laypage.render({
            elem: 'examineManaPage'
            , count: 100
            // ,first: false
            // ,last: false
            // ,prev: '<em><</em>'
            // ,next: '<em>></em>'
            , jump: function (obj) {
                console.log(obj)
                // 当前页点击
                var currentPage = obj.curr;
                var resultData = [
                    {
                        id: 1
                        , nodeName: '节点一'
                        , exmainType: '初次审核'
                        , examinName: '张东阳'
                        , type: '0'
                    }
                    ,{
                        id: 2
                        , nodeName: '节点二'
                        , exmainType: '初次审核'
                        , examinName: '张东阳'
                        , type: '1'
                    }
                    ,{
                        id: 3
                        , nodeName: '节点三'
                        , exmainType: '初次审核'
                        , examinName: '张东阳'
                        , type: '0'
                    }
                    ,{
                        id: 4
                        , nodeName: '节点四'
                        , exmainType: '再次审核'
                        , examinName: '张东阳'
                        , type: '0'
                    }
                    ,{
                        id: 5
                        , nodeName: '节点五'
                        , exmainType: '初次审核'
                        , examinName: '张东阳'
                        , type: '0'
                    }
                    ,{
                        id: 6
                        , nodeName: '节点六'
                        , exmainType: '最终审核'
                        , examinName: '张东阳'
                        , type: '0'
                    }
                    ,{
                        id: 7
                        , nodeName: '节点七'
                        , exmainType: '最终审核'
                        , examinName: '张东阳'
                        , type: '1'
                    }
                    ,{
                        id: 8
                        , nodeName: '节点八'
                        , exmainType: '最终审核'
                        , examinName: '张东阳'
                        , type: '1'
                    }
                    ,{
                        id: 9
                        , nodeName: '节点九'
                        , exmainType: '最终审核'
                        , examinName: '张东阳'
                        , type: '0'
                    }
                    ,{
                        id: 10
                        , nodeName: '节点十'
                        , exmainType: '最终审核'
                        , examinName: '张东阳'
                        , type: '1'
                    }
                ]
                var resultItemsTemp = ''
                if(resultData.length>0){


                for (var i = 0; i < resultData.length; i++) {

                    resultItemsTemp += '<tr data-id="' + resultData[i].id + '">\n' +
                        '  <td>' + resultData[i].nodeName + '</td>\n' +
                        '  <td>' + resultData[i].exmainType + '</td>\n' +
                        '  <td>' + resultData[i].examinName + '</td>\n' +
                        '  <td>\n' +
                        '     <a href="javascript:void(0)" class="edit-btn"><img src="../../image/edit.png" alt=""></a>\n' +
                        '     <a href="javascript:void(0)" class="delete-btn"><img src="../../image/delete.png" alt=""></a>\n'
                        '  </td>\n' +
                        '</tr>'
                }
                }else{
                    resultItemsTemp = '<td colspan="9">暂无内容</td>'
                }
                $("#examineManaList").html(resultItemsTemp)
            }
        });
        // 生成弹层左侧菜单
        layui.tree({
            elem: '#nodeTree' //指定元素
            ,target: '_blank' //是否新选项卡打开（比如节点返回href才有效）
            ,click: function(item){ //点击节点回调
                layer.msg('当前节名称：'+ item.name + '<br>全部参数：'+ JSON.stringify(item));
                console.log(item);
            }
            ,nodes: [ //节点
                {
                    name: '江苏省'
                    ,id: 1
                    // ,alias: 'changyong'
                    ,spread: true
                    ,children: [
                        {
                            name: '南京市'
                            ,id: 11
                            ,href: '#'
                            ,spread: true
                            ,children:[
                                {
                                    name: '建邺区'
                                    ,id: 111
                                    ,spread: true
                                    ,children:[
                                        {
                                            name: '江苏智恒'
                                            ,id: 1111
                                        }
                                    ]
                                }
                                ,{
                                    name: '雨花区'
                                    ,id: 112
                                }
                                ,{
                                    name: '鼓楼区'
                                    ,id: 113
                                }
                                ,{
                                    name: '高淳县'
                                    ,id: 114
                                    ,children:[
                                        {
                                            name: 'xx公司'
                                            ,id: 1141
                                        }, {
                                            name: 'xx公司2'
                                            ,id: 1142
                                        }
                                    ]
                                }
                            ]
                        },
                        {
                            name: '苏州市'
                            ,id: 12
                            ,href: '#'
                            ,children:[
                                {
                                    name: '平江区'
                                    ,id: 121
                                    ,children:[
                                        {
                                            name: 'xx公司'
                                            ,id: 1211
                                        }, {
                                            name: 'xx公司1'
                                            ,id: 1212
                                        }, {
                                            name: 'xx公司2'
                                            ,id: 1213
                                        }
                                    ]
                                }, {
                                    name: '沧浪区'
                                    ,id: 112
                                }, {
                                    name: '太仓市'
                                    ,id: 113
                                }, {
                                    name: '吴江市'
                                    ,id: 114
                                    ,children:[
                                        {
                                            name: 'xx公司1'
                                            ,id: 1141
                                        }, {
                                            name: '小小公司2'
                                            ,id: 1142
                                        }, {
                                            name: 'xx公司3'
                                            ,id: 1143
                                        }
                                    ]
                                }
                            ]
                        },
                    ]
                },
                {
                    name: '浙江省'
                    ,id: 2
                    // ,alias: 'changyong'
                    ,spread: true
                    ,children: [
                        {
                            name: '杭州市'
                            ,id: 21
                            ,href: '#'
                            ,spread: true
                            ,children:[
                                {
                                    name: '临安市'
                                    ,id: 211
                                    ,spread: true
                                    ,children:[
                                        {
                                            name: 'xx公司'
                                            ,id: 2111
                                        }
                                    ]
                                }
                                ,{
                                    name: '富阳区'
                                    ,id: 212
                                }
                                ,{
                                    name: '建德市'
                                    ,id: 213
                                }
                                ,{
                                    name: '淳安县'
                                    ,id: 214
                                    ,children:[
                                        {
                                            name: 'xx公司1'
                                            ,id: 2141
                                        }, {
                                            name: 'xx公司2'
                                            ,id: 2142
                                        }, {
                                            name: 'xx公司3'
                                            ,id: 2143
                                        }
                                    ]
                                }
                            ]
                        },
                        {
                            name: '宁波市'
                            ,id: 22
                            ,href: '#'
                            ,children:[
                                {
                                    name: '江东区'
                                    ,id: 221
                                    ,children:[
                                        {
                                            name: 'xx公司1'
                                            ,id: 2211
                                        }, {
                                            name: 'xx公司2'
                                            ,id: 2212
                                        }
                                    ]
                                }, {
                                    name: '奉化市'
                                    ,id: 222
                                }, {
                                    name: '慈溪市'
                                    ,id: 223
                                }, {
                                    name: '余姚市'
                                    ,id: 224
                                    ,children:[
                                        {
                                            name: '某某公司1'
                                            ,id: 2241
                                        }, {
                                            name: 'xx公司2'
                                            ,id: 2242
                                        }, {
                                            name: 'xx公司3'
                                            ,id: 2243
                                        }
                                    ]
                                }
                            ]
                        }
                    ]
                },
            ]
        });

        // 编辑按钮
        $(document).on('click','.edit-btn',function(){
            layer.msg('你选择的是id为'+$(this).parents("tr").data('id') + "的编辑按钮")
        })
        // 删除按钮
        $(document).on('click','.delete-btn',function(){
            layer.msg('你选择的是id为'+$(this).parents("tr").data('id')+ "删除按钮")
        })
        // 增加节点
        $(document).on('click','.add-node-btn',function(event){
            // event.preventDefault();
            $("#addNodeModal").modal("show");

        })
        // 新增节点弹层保存按钮
        $(document).on('click','.saveNodeModel',function(event){
            // event.preventDefault();
            var knowHouseName = $("#knowHouseName").val();
            var workId = $("input[name='nodeName']:checked").val();
            var data = {
                knowHouseName : knowHouseName,
                workId: workId
            }
            layer.msg("您选择的数据为"+JSON.stringify(data))
            setTimeout(function(){
                $("#addNodeModal").modal("hide");
            },3000)

        })
    });
</script>
</body>
</html>
